<!DOCTYPE HTML>
<html>
  <head>
    <title>My JSP 'index.jsp' starting page</title>

	<link rel="stylesheet" type="text/css" href="plugin/layui/css/layui.css">

  </head>
  
  <body>
  	
  	<button class="layui-btn posttest">测试POST请求</button>
  
  	<form action="index/saveFile" method="post" enctype="multipart/form-data">
  		<p>图片1：<input type="file" name="pic1" multiple="multiple"/></p>
  		<p>图片2：<input type="file" name="pic2" /></p>
  		<p>姓名：<input type="text" name="uname" /></p>
  		<p>年龄：<input type="text" name="old" /></p>
  		<p>爱好：<label><input type="checkbox" name="hobby" value="read" />看书</label>
  			<label><input type="checkbox" name="hobby" value="swim" />游泳</label>
  			<label><input type="checkbox" name="hobby" value="sing" />唱歌</label>
  			<label><input type="checkbox" name="hobby" value="walk" />散步</label>
  		</p>
  		<p><button>提交</button></p>
  	</form>
  	<p>测试上传进度</p>
  	<div class="layui-progress layui-progress-big" lay-filter="progress" lay-showPercent="true">
		<div class="layui-progress-bar layui-bg-blue" lay-percent="0%"></div>
	</div>
	<button class="layui-btn layui-btn-xs selectfile">选择文件</button>
  	<script src="js/jquery.min.js"></script>
  	<script src="plugin/layui/layui.js"></script>
  	<script>
  		layui.use(["layer", "element", "upload"], function(){
  			var element = layui.element;
  			var upload = layui.upload;
  			
  			//"{\"name\":\"zkh\",\"age\":18,\"sex\":\"男\"}"
  			//{"name": "zkh", "age": 18, "sex": "男"}
  			$("button.posttest").click(function(){ 
  				/* $.post("/myframe/test", "{\"name\":\"zkh\",\"age\":18,\"sex\":\"男\"}", function(res){
  					console.log(res);
  				}); */
  				
  				$.ajax({
  					url: "/myframe/test",
  					type: "POST",
  					data: {
  						"name": "zkh", "age": 18, "sex": "男"
  					},
  					success: function(res){
  						console.log(res);
  					}
  				});
  			});
  			
  			
  			/* var timer = null;	//定时器，定时获取上传进度
  			upload.render({
  				elem: '.selectfile',
  				url: 'index/saveFile',
  				accept: "file",
  				field: "pic1",
  				before: function(obj){
  					timer = setInterval(function(){
  						$.post("index/getProgress", function(res){
  							element.progress('progress', res);
  						});
  					}, 1000);
  				},
  				done: function(){
  					if(timer!=null){
  						clearInterval(timer);
  						element.progress('progress', '100%');
  					}
  				},
  				success: function(){
  					if(timer!=null){
  						clearInterval(timer);
  						element.progress('progress', '100%');
  					}
  				},
  				error: function(){
  					if(timer!=null){
  						clearInterval(timer);
  						element.progress('progress', '100%');
  					}
  				},
  			}); */
  		});
  	</script>
  </body>
</html>
